import React, { Component } from 'react'

import Carousels from '../components/Carousele'
import Otext from '../components/Otext'
import Icons from '../components/Icons'
import axios from 'axios'

import '../assets/style/useddetailhouse.less'
//gwx  
//gwx   gwx//gwx  
//gwx   gwx//gwx  
//gwx   gwx
export default class UsedDetailsHouse extends Component {
    constructor(props) {
        super(props)
        this.state = {
            data: ''
        }
    }
    async componentDidMount() {
        let res = await axios.post('/used/secondidfindone', { id: this.props.match.params.id })
        console.log(res.data.data)
        this.setState({
            data: res.data.data
        })
    }
    render() {
        let taberred = {
            width: '100%',
            fontSize: '15px',
            padding: '0',
            backgroundColor: '#EF5D00',
            display: 'inline-block',
            textAlign: 'center',
            color: 'white'
        }
        let tabergreen = {
            width: '100%',
            fontSize: '15px',
            padding: '0',
            backgroundColor: '#00AC00',
            display: 'inline-block',
            textAlign: 'center',
            color: 'white'
        }
        // console.log(this.props.match.params.id,'=============')
        return (
            <div className="useddetailhouse">
                <Carousels></Carousels>
                <div className="useddetailhouse-list">
                    <Otext describe={''} data={this.state.data.title}></Otext>
                    <Otext describe={'均价'} data={this.state.data.price +'元/m²'}></Otext>
                    <Otext describe={'开盘时间'} data={'2018-04-01'}></Otext>
                    <Otext describe={'地址'} data={this.state.data.address}></Otext>
                    <Otext describe={'开发商'} data={this.state.data.Developers}></Otext>
                    <Otext describe={'物业公司'} data={this.state.data.company}></Otext>
                    <div style={{ width: '100%', display: 'flex', justifyContent: 'space-between' }} >
                        <Otext describe={'物业费'} offside={{ color: '50%' }} data={this.state.data.preporty === 0 ? '暂无资料':this.state.data.preporty}></Otext>
                        <Otext describe={'物业类型'} offside={{ color: '50%' }} data={this.state.data.property_type === '' ? '暂无资料':this.state.data.property_type}></Otext>
                    </div>
                    <div style={{ width: '100%', display: 'flex', justifyContent: 'space-between' }} >
                        <Otext describe={'产权年限'} offside={{ color: '50%' }} data={this.state.data.preporty_right}></Otext>
                        <Otext describe={'建筑类型'} offside={{ color: '50%' }} data={this.state.data.Building_type === '' ? '暂无资料':this.state.data.Building_type}></Otext>
                    </div>
                    <div style={{ width: '100%', display: 'flex', justifyContent: 'space-between' }} >
                        <Otext describe={'占地面积'} offside={{ color: '50%' }} data={this.state.data.Land_occupation === 0 ? '暂无资料':this.state.data.Land_occupation}></Otext>
                        <Otext describe={'建筑面积'} offside={{ color: '50%' }} data={this.state.data.building_measure === 0 ? '暂无资料':this.state.data.building_measure}></Otext>
                    </div>
                    <Otext describe={'车位情况'} data={this.state.data.cart_position === 0 ? '暂无资料':this.state.data.cart_position}></Otext>
                    <Otext describe={'计划户数'} data={this.state.data.plan_user === 0 ? '暂无资料':this.state.data.plan_user}></Otext>
                    <Otext describe={'预售证号'} data={this.state.data.pre_sale_card === 0 ? '暂无资料':'有'}></Otext>
                </div>

                <div className="useddetailhouse-tabbar">
                    <div className="tabbar-li"><Icons icons={"iconfont icon-guanzhu"} ific={'1'} text={'关注'}></Icons></div>
                    <div className="tabbar-li" ><Icons icons={"iconfont icon-icon--"} styicon={{ color: '#F04C4C' }} text={'资讯'}></Icons></div>
                    <div className="tabbar-li2"> <Otext describe={''} offside={tabergreen} data={'地图导航'}></Otext></div>
                    <div className="tabbar-li2"> <Otext describe={''} offside={taberred} data={'预约看房'}></Otext></div>
                </div>
            </div>
        )
    }
}
